<div class="effeckt effeckt-demo-modals">

  <header>
    <h2>
      Page Transitions
      <a href="page-transitions.html">#</a>
    </h2>
    <!-- <span class="source">
      ...
    </span> -->
  </header>

  <button class="effeckt-page-transition-button" data-effeckt-transition-in="slide-from-left" data-effeckt-transition-out="slide-to-right" data-effeckt-transition-page="page-2">Slide From Left</button>

  <button class="effeckt-page-transition-button" data-effeckt-transition-in="slide-from-right" data-effeckt-transition-out="slide-to-left" data-effeckt-transition-page="page-3">Slide From Right</button>

  <button class="effeckt-page-transition-button" data-effeckt-transition-in="slide-from-bottom" data-effeckt-transition-out="slide-to-top" data-effeckt-transition-page="page-4">Slide From Bottom</button>

  <button class="effeckt-page-transition-button" data-effeckt-transition-in="slide-from-top" data-effeckt-transition-out="slide-to-bottom" data-effeckt-transition-page="page-5">Slide From Top</button>


  <button class="effeckt-page-transition-button" data-effeckt-transition-in="scale-up-from-behind" data-effeckt-transition-out="scale-up-to-front" data-effeckt-transition-page="page-5" data-effeckt-needs-perspective="true">Scale Up From Behind</button>

  <button class="effeckt-page-transition-button" data-effeckt-transition-in="scale-down-from-front" data-effeckt-transition-out="scale-down-to-behind" data-effeckt-transition-page="page-5" data-effeckt-needs-perspective="true">Scale Down From Front</button>


  <button class="effeckt-page-transition-button" data-effeckt-transition-in="scale-down-slide-from-right" data-effeckt-transition-out="scale-down-slide-to-left" data-effeckt-transition-page="page-5" data-effeckt-needs-perspective="true">Scale Down Slide From Right</button>

  <button class="effeckt-page-transition-button" data-effeckt-transition-in="scale-down-slide-from-left" data-effeckt-transition-out="scale-down-slide-to-right" data-effeckt-transition-page="page-5" data-effeckt-needs-perspective="true">Scale Down Slide From Left</button>

  <button class="effeckt-page-transition-button" data-effeckt-transition-in="scale-down-slide-from-top" data-effeckt-transition-out="scale-down-slide-to-bottom" data-effeckt-transition-page="page-5" data-effeckt-needs-perspective="true">Scale Down Slide From Top</button>

  <button class="effeckt-page-transition-button" data-effeckt-transition-in="scale-down-slide-from-bottom" data-effeckt-transition-out="scale-down-slide-to-top" data-effeckt-transition-page="page-5" data-effeckt-needs-perspective="true">Scale Down Slide From Bottom</button>


  <button class="effeckt-page-transition-button" data-effeckt-transition-in="rotate-to-front" data-effeckt-transition-out="rotate-to-behind" data-effeckt-transition-page="page-5" data-effeckt-needs-perspective="true">Rotate to Behind</button>


  <button class="effeckt-page-transition-button" data-effeckt-transition-in="flip-to-right-front" data-effeckt-transition-out="flip-to-right-back" data-effeckt-transition-page="page-5" data-effeckt-needs-perspective="true">Flip to Right</button>

  <button class="effeckt-page-transition-button" data-effeckt-transition-in="flip-to-left-front" data-effeckt-transition-out="flip-to-left-back" data-effeckt-transition-page="page-5" data-effeckt-needs-perspective="true">Flip to Left</button>

  <button class="effeckt-page-transition-button" data-effeckt-transition-in="flip-to-top-front" data-effeckt-transition-out="flip-to-top-back" data-effeckt-transition-page="page-5" data-effeckt-needs-perspective="true">Flip to Top</button>

  <button class="effeckt-page-transition-button" data-effeckt-transition-in="flip-to-bottom-front" data-effeckt-transition-out="flip-to-bottom-back" data-effeckt-transition-page="page-5" data-effeckt-needs-perspective="true">Flip to Bottom</button>

</div>
